<template>
  <ElDrawer v-model="modifyVisible">
    <ElForm label-width="120px" style="width: 280px">
      <ElFormItem label="编号">
        <ElTag> {{ player.playerCode }}</ElTag>
      </ElFormItem>
      <ElFormItem label="昵称">
        <ElInput v-model="player.nickname"></ElInput>
      </ElFormItem>
      <ElFormItem label="金币数量">
        <ElInputNumber v-model="player.goldCoin"></ElInputNumber>
      </ElFormItem>
      <ElFormItem label="银币数量">
        <ElInputNumber v-model="player.silverCoin"></ElInputNumber>
      </ElFormItem>
      <ElFormItem label="名称">
        <ElInput v-model="player.usernameFk"></ElInput>
      </ElFormItem>
      <ElFormItem label="职业">
        <ElSelect v-model="player.profession">
          <template v-for="(e, i) in professionEnums" :key="i">
            <ElOption :label="e.label" :value="e.value"></ElOption>
          </template>
        </ElSelect>
      </ElFormItem>
      <ElFormItem>
        <ElButton type="primary">Modify</ElButton>
      </ElFormItem>
    </ElForm>
  </ElDrawer>
</template>
<script lang="ts">
/**
 * 页面核心数据结构体说明文档
 *
 *
 */
// import from

export default {
  name: 'ModifyPlayer',
  props: {
    sampleP: {
      type: Number,
      default: 0
    }
  },
  data() {
    return {
      sampleD: 'value',
      modifyVisible: false,
      player: {
        goldCoin: 10,
        silverCoin: 30,
        nickname: 'xxx',
        usernameFk: '',
        profession: '',
        version: 0,
        playerId: 0,
        playerCode: 'string'
      },
      professionEnums: [
        {
          label: '作家',
          value: 'writer'
        },
        {
          label: '会计',
          value: 'accountant'
        },
        {
          label: '巫师',
          value: 'wizard'
        },
        {
          label: '建筑师',
          value: 'architect'
        }
      ]
    }
  },
  computed: {
    /* sampleC() {
      return this.sampleD + "--";
    }, */
  },
  created() {},
  mounted() {},
  methods: {
    // sampleM() {},
    show(data: any) {
      this.player = data
      this.modifyVisible = true
    }
  },
  watch: {
    // sampleP(n, o) {},
  }
}
</script>

<!--<style scoped>-->
<style lang="scss" scoped></style>
